<template>
	<view class="index">
		<view class="uni-tab-bar">
			
			<scroll-list-head :tabsList="tabs" :currentTab="currentTab" @changeTab="selectTab"></scroll-list-head>
			
			<swiper class="swiper-box" @change="selectSwiper" :current="currentTab">
				<swiper-item v-for="(switem,idx) in momentList" :key="idx">
					<template v-if="switem.moments.length !== 0">
					<scroll-view scroll-y class="list" @scrolltolower="loadMore(idx)">
						<moment v-for="(item,index) in switem.moments" :moment="item" :key="index"></moment>
						<load-more :text="switem.loadtext"/>
					</scroll-view>
					</template>
					<template v-else>
						<no-msg></no-msg>
					</template>
				</swiper-item>
			</swiper>
			
		</view>
	</view>
</template>

<script>
	import scrollListHead from "../../components/scroll-list/scroll-list-head.vue"
	
	import Moment from "../../components/moment.vue"
	import loadMore from "../../components/loadmore.vue"
	import NoMsg from "../../components/nomsg.vue"
	
	export default {
		data() {
			return {
				currentTab: 0,
				tabs: ["关注","关注","关注","关注","关注","关注","关注"],
				momentList: [{
					loadtext: '奥术大师大',
					moments : [ {
							userpic: "/static/test/logo.png",
							username: "卤打湿",
							info: "小程序通用能力，你一定用得上",
							infopic: "/static/test/banner.jpg", // info图片
							infotype: 1, // 1表示图片 2 表示视频,
							vedioshow: "20w", //展现了多少次
							vediolong: "2:47", // 视频多少秒
							thumb: 1000,
							down: 1000,
							commentnum: 100,
							sharenum: 100,
							own: {
								isfollow:  true, // 如果没有就全部登录就全部显示
								islike: 2, // 是否喜欢 0->没有操作 1-> 喜欢 2 -> 不喜欢
							}
						},{
							userpic: "/static/test/logo.png",
							username: "卤打湿",
							info: "小程序通用能力，你一定用得上",
							infopic: "/static/test/banner.jpg", // info图片
							infotype: 1, // 1表示图片 2 表示视频,
							vedioshow: "20w", //展现了多少次
							vediolong: "2:47", // 视频多少秒
							thumb: 1000,
							down: 1000,
							commentnum: 100,
							sharenum: 100,
							own: {
								isfollow:  true, // 如果没有就全部登录就全部显示
								islike: 2, // 是否喜欢 0->没有操作 1-> 喜欢 2 -> 不喜欢
							}
						},{
							userpic: "/static/test/logo.png",
							username: "卤打湿",
							info: "小程序通用能力，你一定用得上",
							infopic: "/static/test/banner.jpg", // info图片
							infotype: 1, // 1表示图片 2 表示视频,
							vedioshow: "20w", //展现了多少次
							vediolong: "2:47", // 视频多少秒
							thumb: 1000,
							down: 1000,
							commentnum: 100,
							sharenum: 100,
							own: {
								isfollow:  true, // 如果没有就全部登录就全部显示
								islike: 2, // 是否喜欢 0->没有操作 1-> 喜欢 2 -> 不喜欢
							}
						},{
							userpic: "/static/test/logo.png",
							username: "卤打湿",
							info: "小程序通用能力，你一定用得上",
							infopic: "/static/test/banner.jpg", // info图片
							infotype: 1, // 1表示图片 2 表示视频,
							vedioshow: "20w", //展现了多少次
							vediolong: "2:47", // 视频多少秒
							thumb: 1000,
							down: 1000,
							commentnum: 100,
							sharenum: 100,
							own: {
								isfollow:  true, // 如果没有就全部登录就全部显示
								islike: 2, // 是否喜欢 0->没有操作 1-> 喜欢 2 -> 不喜欢
							}
						}]
					
				},{
					loadtext: '奥术大师大',
					moments : [ {
							userpic: "/static/test/logo.png",
							username: "卤打湿",
							info: "小程序通用能力，你一定用得上",
							infopic: "/static/test/banner.jpg", // info图片
							infotype: 1, // 1表示图片 2 表示视频,
							vedioshow: "20w", //展现了多少次
							vediolong: "2:47", // 视频多少秒
							thumb: 1000,
							down: 1000,
							commentnum: 100,
							sharenum: 100,
							own: {
								isfollow:  true, // 如果没有就全部登录就全部显示
								islike: 2, // 是否喜欢 0->没有操作 1-> 喜欢 2 -> 不喜欢
							}
						},{
							userpic: "/static/test/logo.png",
							username: "卤打湿",
							info: "小程序通用能力，你一定用得上",
							infopic: "/static/test/banner.jpg", // info图片
							infotype: 1, // 1表示图片 2 表示视频,
							vedioshow: "20w", //展现了多少次
							vediolong: "2:47", // 视频多少秒
							thumb: 1000,
							down: 1000,
							commentnum: 100,
							sharenum: 100,
							own: {
								isfollow:  true, // 如果没有就全部登录就全部显示
								islike: 2, // 是否喜欢 0->没有操作 1-> 喜欢 2 -> 不喜欢
							}
						},{
							userpic: "/static/test/logo.png",
							username: "卤打湿",
							info: "小程序通用能力，你一定用得上",
							infopic: "/static/test/banner.jpg", // info图片
							infotype: 1, // 1表示图片 2 表示视频,
							vedioshow: "20w", //展现了多少次
							vediolong: "2:47", // 视频多少秒
							thumb: 1000,
							down: 1000,
							commentnum: 100,
							sharenum: 100,
							own: {
								isfollow:  true, // 如果没有就全部登录就全部显示
								islike: 2, // 是否喜欢 0->没有操作 1-> 喜欢 2 -> 不喜欢
							}
						},{
							userpic: "/static/test/logo.png",
							username: "卤打湿",
							info: "小程序通用能力，你一定用得上",
							infopic: "/static/test/banner.jpg", // info图片
							infotype: 1, // 1表示图片 2 表示视频,
							vedioshow: "20w", //展现了多少次
							vediolong: "2:47", // 视频多少秒
							thumb: 1000,
							down: 1000,
							commentnum: 100,
							sharenum: 100,
							own: {
								isfollow:  true, // 如果没有就全部登录就全部显示
								islike: 2, // 是否喜欢 0->没有操作 1-> 喜欢 2 -> 不喜欢
							}
						}]
					
				},{
					loadtext: '没有更多了',
					moments : [ {
							userpic: "/static/test/logo.png",
							username: "卤打湿",
							info: "小程序通用能力，你一定用得上",
							infopic: "/static/test/banner.jpg", // info图片
							infotype: 1, // 1表示图片 2 表示视频,
							vedioshow: "20w", //展现了多少次
							vediolong: "2:47", // 视频多少秒
							thumb: 1000,
							down: 1000,
							commentnum: 100,
							sharenum: 100,
							own: {
								isfollow:  true, // 如果没有就全部登录就全部显示
								islike: 2, // 是否喜欢 0->没有操作 1-> 喜欢 2 -> 不喜欢
							}
						},{
							userpic: "/static/test/logo.png",
							username: "卤打湿",
							info: "小程序通用能力，你一定用得上",
							infopic: "/static/test/banner.jpg", // info图片
							infotype: 1, // 1表示图片 2 表示视频,
							vedioshow: "20w", //展现了多少次
							vediolong: "2:47", // 视频多少秒
							thumb: 1000,
							down: 1000,
							commentnum: 100,
							sharenum: 100,
							own: {
								isfollow:  true, // 如果没有就全部登录就全部显示
								islike: 2, // 是否喜欢 0->没有操作 1-> 喜欢 2 -> 不喜欢
							}
						},{
							userpic: "/static/test/logo.png",
							username: "卤打湿",
							info: "小程序通用能力，你一定用得上",
							infopic: "/static/test/banner.jpg", // info图片
							infotype: 1, // 1表示图片 2 表示视频,
							vedioshow: "20w", //展现了多少次
							vediolong: "2:47", // 视频多少秒
							thumb: 1000,
							down: 1000,
							commentnum: 100,
							sharenum: 100,
							own: {
								isfollow:  true, // 如果没有就全部登录就全部显示
								islike: 2, // 是否喜欢 0->没有操作 1-> 喜欢 2 -> 不喜欢
							}
						},{
							userpic: "/static/test/logo.png",
							username: "卤打湿",
							info: "小程序通用能力，你一定用得上",
							infopic: "/static/test/banner.jpg", // info图片
							infotype: 1, // 1表示图片 2 表示视频,
							vedioshow: "20w", //展现了多少次
							vediolong: "2:47", // 视频多少秒
							thumb: 1000,
							down: 1000,
							commentnum: 100,
							sharenum: 100,
							own: {
								isfollow:  true, // 如果没有就全部登录就全部显示
								islike: 2, // 是否喜欢 0->没有操作 1-> 喜欢 2 -> 不喜欢
							}
						}]
					
				},{
					loadtext: '奥术大师大',
					moments : [ {
							userpic: "/static/test/logo.png",
							username: "卤打湿",
							info: "小程序通用能力，你一定用得上",
							infopic: "/static/test/banner.jpg", // info图片
							infotype: 1, // 1表示图片 2 表示视频,
							vedioshow: "20w", //展现了多少次
							vediolong: "2:47", // 视频多少秒
							thumb: 1000,
							down: 1000,
							commentnum: 100,
							sharenum: 100,
							own: {
								isfollow:  true, // 如果没有就全部登录就全部显示
								islike: 2, // 是否喜欢 0->没有操作 1-> 喜欢 2 -> 不喜欢
							}
						},{
							userpic: "/static/test/logo.png",
							username: "卤打湿",
							info: "小程序通用能力，你一定用得上",
							infopic: "/static/test/banner.jpg", // info图片
							infotype: 1, // 1表示图片 2 表示视频,
							vedioshow: "20w", //展现了多少次
							vediolong: "2:47", // 视频多少秒
							thumb: 1000,
							down: 1000,
							commentnum: 100,
							sharenum: 100,
							own: {
								isfollow:  true, // 如果没有就全部登录就全部显示
								islike: 2, // 是否喜欢 0->没有操作 1-> 喜欢 2 -> 不喜欢
							}
						},{
							userpic: "/static/test/logo.png",
							username: "卤打湿",
							info: "小程序通用能力，你一定用得上",
							infopic: "/static/test/banner.jpg", // info图片
							infotype: 1, // 1表示图片 2 表示视频,
							vedioshow: "20w", //展现了多少次
							vediolong: "2:47", // 视频多少秒
							thumb: 1000,
							down: 1000,
							commentnum: 100,
							sharenum: 100,
							own: {
								isfollow:  true, // 如果没有就全部登录就全部显示
								islike: 2, // 是否喜欢 0->没有操作 1-> 喜欢 2 -> 不喜欢
							}
						},{
							userpic: "/static/test/logo.png",
							username: "卤打湿",
							info: "小程序通用能力，你一定用得上",
							infopic: "/static/test/banner.jpg", // info图片
							infotype: 1, // 1表示图片 2 表示视频,
							vedioshow: "20w", //展现了多少次
							vediolong: "2:47", // 视频多少秒
							thumb: 1000,
							down: 1000,
							commentnum: 100,
							sharenum: 100,
							own: {
								isfollow:  true, // 如果没有就全部登录就全部显示
								islike: 2, // 是否喜欢 0->没有操作 1-> 喜欢 2 -> 不喜欢
							}
						}]
					
				},{
					loadtext: '奥术大师大',
					moments : [ ],
					}]
			}
		},
		onLoad() {
		},
		onNavigationBarSearchInputClicked(){
			uni.navigateTo({
				url: '../search/search',
			});
		},
		onNavigationBarButtonTap(e){
			switch (e.index){
				case 1:
					uni.navigateTo({
						url: '../fabu/fabu',
					});
					break;
			}
		},
		methods: {
			selectTab(index){
				this.currentTab = index
			},
			selectSwiper(e){
				// console.log(this.currentTab)
				this.currentTab = e.detail.current
			},
			loadMore(idx){
				this.momentList[idx].loadtext = "加载中..."
				setTimeout(() => {
					this.momentList[idx].moments.push({
								userpic: "/static/test/logo.png",
								username: "卤打湿",
								info: "小程序通用能力，你一定用得上",
								infopic: "/static/test/banner.jpg", // info图片
								infotype: 1, // 1表示图片 2 表示视频,
								vedioshow: "20w", //展现了多少次
								vediolong: "2:47", // 视频多少秒
								thumb: 1000,
								down: 1000,
								commentnum: 100,
								sharenum: 100,
								own: {
									isfollow:  true, // 如果没有就全部登录就全部显示
									islike: 2, // 是否喜欢 0->没有操作 1-> 喜欢 2 -> 不喜欢
								}
							})
					this.momentList[idx].loadtext = "加载更多"
				},1000)		
			}
		},
		components:{
			Moment,
			loadMore,
			NoMsg,
			scrollListHead
		}
	}
</script>
	<!-- 
	
	969696
	343434
	fede33 -->
<style scoped>
	.index {
		height: 100vh;
	}
</style>
